<!-- 编辑新闻 -->

<template>
    <div class='bgff pd pt10 pm10'>
        <div class=" ">
            <n-button type="primary" size="medium" @click="addNews">{{ isbj ? '编辑' : '添加' }}招聘</n-button>
            <n-button class="ml20" type="primary" size="medium" @click="callBack">返回</n-button>
        </div>
        <div class="mt20">
            <n-form ref="formRef" label-placement="left" label-width="auto" :model="formValue" :rules="rules" :style="{
                maxWidth: '640px'
            }">
                 <n-grid :cols="24" :x-gap="20" class="w100">
                <n-form-item-gi   :span="24" label="招聘职位:" path="jobVacancy">
                    <n-input v-model:value='formValue.jobVacancy' placeholder="输入招聘职位" />
                </n-form-item-gi>

                <n-form-item-gi  :span="12" label="招聘职位:" path="department">
                    <n-input v-model:value='formValue.department' placeholder="输入部门" />
                </n-form-item-gi>
                <n-form-item-gi  :span="12"  label="招聘人数:" path="recruitingNumbers">
                    <n-input v-model:value='formValue.recruitingNumbers' placeholder="输入招聘人数" />
                </n-form-item-gi>
                <n-form-item-gi  :span="24" label="办公点:" path="Placeofoffice">
                    <n-input v-model:value='formValue.Placeofoffice' placeholder="输入办公点" />
                </n-form-item-gi>
             
            </n-grid>
           
            </n-form>
        </div>
        <p class="mb10">职位要求：</p>
        <div class="fwbclass">
            <tinymce ref="tinymceref"></tinymce>
        </div>


        <n-modal v-model:show="photoShowModal" preset="card" class="Stock-diagnosis">
            <template #header>
                <div>新闻封面</div>
            </template>
            <div>
                <photoGallery @getImg="getImg" types="新闻封面"></photoGallery>
            </div>
            <template #action>
                <div class="tr">
                    <n-button @click="photoShowModal = false"> 取消 </n-button>
                    <n-button class="ml10" type="info" @click="setImg"> 确定 </n-button>
                </div>
            </template>
        </n-modal>
    </div>
</template>
<script lang='ts' setup>
import { ref, onMounted } from "vue";
import tinymce from "../../../components/util/tinymce.vue"
import photoGallery from "../../../components/util/photoGallery";
import { callBack, dxpost, qurl, dxget } from "../../../util/index"
import { types } from "../public/index";
const cz = qurl()
const formRef = ref()
const tinymceref = ref()
const isbj = ref(false) // 是否为编辑状态
const photoShowModal = ref(false)
const formValue = ref({
    jobVacancy: "",
    department: "",
    Placeofoffice: "",
    recruitingNumbers: "",
    recruitmentRequirements:""
})





const songs = types
const rules = {
    jobVacancy: {
        required: true,
        message: '输入招聘职位',
        trigger: 'blur'
    }, department: {
        required: true,
        message: '输入部门',
        trigger: 'blur'
    }, Placeofoffice: {
        required: true,
        message: '输入办公点',
        trigger: 'blur'
    }, recruitingNumbers: {
        required: true,
        message: '输入招聘人数',
        trigger: 'blur'
    }
}
const addNews = (e) => {
    e.preventDefault();
    formRef.value.validate((errors) => {
        if (!errors) {
            addNes()
        }
    });
}

const addNes = async () => {
    formValue.value.recruitmentRequirements = tinymceref.value.getContent()
    const { errno, data }: any = await dxpost("djhs/djRecruitment", formValue.value, isbj.value ? 'put' : 'post')
    if (errno == 0) {
        window.$message.success('操作成功！')
        callBack()
    }
}
const getNews = async () => {
    const { data }: any = await dxget("djhs/djRecruitment", { id: cz.id })
    tinymceref.value.setContent(data.recruitmentRequirements)
    formValue.value = data
}
if (cz.id) {
    isbj.value = true
    getNews()
}




</script>
<style scoped>
.fwbclass {
    height: 600px;
}
</style>